﻿/*京东秒杀开始======================*/
.skill-jd {
    margin-top: 20px;
    height: 320px;
    /*background-color: orange;*/
}

.skill-jd .top-skill {
    height: 55px;
    background-color: red;
    background: url("../images/seckill_hd.png") no-repeat;
}

.skill-jd .top-skill .left-skill { /*向左浮动的div*/
    height: 55px;
    /*background-color: pink;*/
    width: 400px;
    float: left;
    padding: 0 30px;
    position: relative; /*为了做三角形不得已这样了*/
}

.top-skill .left-skill .clock { /*秒杀中的钟表图标*/
    width: 36px;
    height: 40px;
    display: block;
    /*background-color: green;*/
    margin-top: 5px;
    background: url("../images/sprite_index@1x.png") no-repeat 0 -40px;
    float: left;
}

.top-skill .left-skill h3 {
    font-family: "宋体";
    font-size: 26px;
    line-height: 40px;
    height: 40px;
    padding-top: 9px;
    color: #FFF;
    float: left;
}

.top-skill .left-skill a {
    float: left;
    margin-top: 24px;
    margin-left: 10px;
    color: #FFF;
    font-size: 14px;
    position: relative;
}

.top-skill .left-skill a i { /*圆圈的箭头*/
    width: 16px;
    height: 16px;
    display: block;
    /*background-color: green;*/
    position: absolute;
    top: 2px;
    right: -22px;
    background: url("../images/sprite_index@1x.png") no-repeat -154px -40px;
}

.top-skill .left-skill s { /*左上角的三角形*/
    width: 24px;
    height: 24px;
    display: block;
    /*background-color: green;*/
    position: absolute;
    left: -2px;
    top: -3px;
    background: url("../images/sprite_index@1x.png") no-repeat -191px -48px;
}

/*右侧时间的样式*/
.skill-jd .top-skill .right-skill {
    height: 55px;
    width: 300px;
    background-color: #CF0313;
    float: right;
    padding: 0 10px;
}

.skill-jd .top-skill .right-skill span { /*设置所有的span标签距离上面的位置及浮动*/
    float: left;
    font-size: 14px;
    color: #FFF;
    margin-top: 25px;
}

.skill-jd .top-skill .right-skill .time { /*设置时间整体距离上面的位置*/
    /*width: 160px;*/
    height: 40px;
    float: left;
    margin-top: 10px;
}

.skill-jd .top-skill .right-skill .time div { /*设置所有的div全部向左浮动*/
    float: left;
}

.skill-jd .top-skill .right-skill .public { /*设置小时，分钟，秒,的宽高及margin的左右距离*/
    width: 35px;
    height: 37px;
    background-color: #440106;
    margin: 0 10px;
}

.skill-jd .top-skill .right-skill .time span { /*设置显示时间中的span的位置及字体和行高*/
    margin-top: 0;
    font-size: 24px;
    font-weight: 700;
    color: #F90013;
    line-height: 37px;
    margin-left: 3px;

}

.skill-jd .top-skill .right-skill .pointer {
    position: relative;
}

.skill-jd .top-skill .right-skill .top-p,
.skill-jd .top-skill .right-skill .btm-p { /*设置两个小圆点*/
    width: 4px;
    height: 4px;
    background-color: #440106;
    border-radius: 2px;
}

.skill-jd .top-skill .right-skill .top-p {
    position: absolute;
    top: 22px;
    left: -3px;
}

.skill-jd .top-skill .right-skill .btm-p {
    position: absolute;
    top: 12px;
    left: -3px;
}

/*秒杀下面的列表部分--------------------*/
.skill-jd .bottom-skill {
    height: 240px;
    background-color: #FFF;
}

.skill-jd .bottom-skill ul {
    float: left;
    /*margin-top: 10px;*/
}

.skill-jd .bottom-skill li {

    float: left;
    padding: 0 20px 0 10px;
    border-right: 1px solid #E7E7E7;
    margin-top: 12px;
    position: relative;
}

.skill-jd .bottom-skill li a {
    width: 170px;
    /*height: 230px;*/
    display: block;
    text-align: center;
}

.skill-jd .bottom-skill li a p {
    margin-top: 15px;
    width: 163px;
    text-align: left;
    overflow: hidden;
    height: 38px;
}

.skill-jd .bottom-skill li a i {
    margin-top: -10px;
    width: 170px;
    height: 20px;
    display: block;
    background: url("../images/sprite_index@1x.png") no-repeat;
}

.skill-jd .bottom-skill li .p-span {
    padding: 5px 0;

}

.skill-jd .bottom-skill li span {
    font-size: 20px;
    font-weight: 700;
    color: red;
    padding: 3px 0;
    /*padding-left: 5px;*/
}

.skill-jd .bottom-skill li s {
    width: 30px;
    height: 40px;
    display: block;
    background: url("../images/sprite_index@1x.png") no-repeat 0 -100px;
    text-align: center;
    line-height: 40px;
    position: absolute;
    left: 9px;
    top: 5px;
}

.skill-jd .bottom-skill .border-none {
    border-right: none;
}

.skill-jd .bottom-skill .right-img {
    float: left;
    margin-top: 12px;
}

/*京东秒杀结束======================*/

/*京东中间的广告=================*/
.middle-ad {
    width: 100%;
    margin-top: 20px;
}

.middle-ad a {
    width: 100%;
    height: 480px;
    display: block;
    background: url("../images/58c01f51Nfff1c782.png") no-repeat top center;
    position: absolute;
}

.main-banner {
    height: 480px;
    /*background-color: red;*/
    margin-bottom: 20px;
    position: relative;
}

.main-banner .left-banner {
    height: 465px;
    width: 190px;
    padding-top: 15px;
    background-color: #6E6568;
    float: left;
    position: relative;
}

.main-banner .left-banner li {
    height: 30px;
    line-height: 30px;
    padding-left: 13px;
}

/*左侧导航中的菜单样式*/
.main-banner .left-banner-item {
    display: none;
}

.main-banner .bannercurrent {
    display: block;
    position: absolute;
    z-index: 15;
    left: 190px;
}

.main-banner .left-banner-item .show {
    display: block;
}

.main-banner .left-banner-item div {
    display: none;
}

.main-banner .left-banner li:hover {
    background-color: #999395;
}

.main-banner .left-banner li a {
    font-size: 14px;
    color: #FFFFFF;
    font-family: "微软雅黑";
}

.main-banner .left-banner li span {
    font-size: 14px;
    color: #FFFFFF;
    font-family: "微软雅黑";
    margin: 0 4px 0;
}

.main-banner .left-banner li a:hover {
    color: #c81623;
}

/*轮播图*/
.middle-banner {
    width: 790px;
    float: left;
    height: 480px;
    margin-left: 10px;
}

.middle-banner .top-md-ban {
    width: 790px;
    height: 340px;
    overflow: hidden;
    position: relative;
}

.middle-banner .top-md-ban .lunbotu {
    position: absolute;
    width: 1000%;
    left: 0;
    top: 0;

}

.middle-banner .top-md-ban .lunbotu li {
    float: left;
}

/*焦点div*/
.top-md-ban .pages {
    width: 790px;
    height: 60px;
    margin-top: -30px;
    top: 50%;
    left: 0;
    position: absolute;
    cursor: pointer;
    opacity: 0;
}

.top-md-ban .pages {
    position: relative;
}

.top-md-ban .pages a {
    width: 30px;
    height: 60px;
    display: block;
    text-align: center;
    line-height: 60px;
    color: #FFF;
    background-color: rgba(0, 0, 0, .2);
    font: 400 22px/60px "宋体";
}

.top-md-ban .pages a:hover {
    background-color: rgba(0, 0, 0, .7);
}

.pages .arrow-left {
    float: left;
}

.pages .arrow-right {
    float: right;
}

/*小按钮*/
.slder-item {
    width: 166px;
    height: 20px;
    background-color: rgba(255, 255, 255, .4);
    position: absolute;
    bottom: 20px;
    left: 50%;
    margin-left: -84px;
    padding: 0 8px;
}

.slder-item ul {
    width: 182px;
}

.slder-item li {
    width: 12px;
    height: 12px;
    border-radius: 6px;
    float: left;
    background-color: #FFF;
    margin-top: 3px;
    margin-right: 10px;
    cursor: pointer;
}

.slder-item .color-red {
    background-color: #DB192A
}

.btm-md-ban {
    margin-top: 10px;
}

.btm-md-ban .ban-left {
    float: left;

}

.btm-md-ban .ban-right {
    float: right;
}

/*右侧内容*/
.right-banner {
    width: 190px;
    height: 480px;
    background-color: #FFF;
    float: right;
}

.right-banner .user {
    height: 114px;
    border-bottom: 1px solid #CCC;
}

.right-banner .user .user-top img {
    width: 45px;
    height: 45px;
    border-radius: 23px;
}

.user .user-top .left-user {
    float: left;
    margin-left: 10px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.user .user-top .right-user {
    float: right;
    margin-top: 20px;
    margin-right: 15px;
}

.user .user-top .right-user p {
    margin-bottom: 5px;
}

.user .user-top .right-user p a {
    font-weight: 700;
}

.user .user-btm {
    /*width: 158px;*/
    /*height: 24px;*/
    /*background-color: red;*/

    clear: both;
    margin-left: 10px;

}

.user .user-btm a {
    float: left;
    width: 70px;
    height: 20px;
    display: block;
    border: 2px solid #E01222;
    margin-right: 10px;
    text-align: center;
    line-height: 20px;
    color: #E01222;
    font-family: "微软雅黑";
}

.news {
    padding: 0 10px;
    border-bottom: 1px solid #CCC;
    height: 154px;
}

.news .top-news {
    height: 26px;
    border-bottom: 1px solid #CCC;
    line-height: 26px;
    position: relative;

}

.news .top-news li {
    float: left;

}

.news .top-news .line {
    width: 1px;
    height: 10px;
    background-color: #CCC;
    margin: 8px 10px 0;
}

.news .top-news .duo {
    float: right;
}

.news .top-news .line-dv {
    width: 28px;
    height: 3px;
    background-color: #E01222;
    position: absolute;
    top: 26px;
}

.news .btm-news {
    margin-top: 10px;
}

.news .btm-news ul {
    display: none;
}

.news .btm-news .current {
    display: block;
}

.news .btm-news li {
    height: 25px;
    line-height: 25px;
}

/*生活服务*/
.lifeserv {
    overflow: hidden;
}

.lifeserv ul {
    width: 200px;
}

.lifeserv li {
    float: left;
    width: 47px;
    height: 69px;
    border-right: 1px solid #CCC;
    border-bottom: 1px solid #CCC;
}

.lifeserv li a {
    width: 47px;
    height: 29px;
    display: block;
    text-align: center;
    padding-top: 40px;
    position: relative;

}

.lifeserv li i {
    width: 22px;
    height: 22px;
    display: block;
    background-color: red;
    position: absolute;
    background: url("../images/sprite_fs@1x.png") no-repeat;
    left: 10px;
    top: 15px;
}

.lifeserv li .i1 {
    background-position: 0 -89px;
}

.lifeserv li .i2 {
    background-position: 0 -45px;
}

.lifeserv li .i3 {
    background-position: -45px -88px;
}

.lifeserv li .i4 {
    background-position: -87px 0;
}

.lifeserv li .i5 {
    background-position: -89px -45px;
}

.lifeserv li .i6 {
    background-position: 0 -0;
}

.lifeserv li .i7 {
    background-position: -45px -45px;
}

.lifeserv li .i8 {
    background-position: -45px 0;
}

.lifeserv li .i9 {
    background-position: -134px 0;
}

.lifeserv li .i10 {
    background-position: -134px -45px;
}

.lifeserv li .i11 {
    background-position: -134px -88px;
}

.lifeserv li .i12 {
    background-position: -45px 0;
}
